<template>
  <div class="table-card card">
    <div class="table-title">剥取素材或掉落物</div>
    <div class="table-container">
      <wid-table :headers="peelHeaders" :data="info.peelData" :widths="peelWidths" :type="peelType"/>
    </div>
    <div class="table-title">各种获取方式汇总</div>
    <div class="table-container">
      <wid-table :headers="destoryHeaders" :data="info.destoryData" :widths="destoryWidths" :type="destoryType"/>
    </div>
  </div>
</template>

<script>
import {get} from '@/util'
import WidTable from '@/components/WidTable'
import etag from '@/components/Etag'
export default {
  props: [
    'id'
  ],
  components: {
    etag,
    WidTable
  },
  data () {
    return {
      info: {
        peelData: [
          []
        ]
      },
      peelHeaders: ['方法', '下位', '上位'],
      peelWidths: [
        '20%', '40%', '40%'
      ],
      peelType: [
        0, 0, 0
      ],
      destoryHeaders: ['方法', '下位', '上位'],
      destoryWidths: [
        '20%', '40%', '40%'
      ],
      destoryType: [
        0, 0, 0
      ]
    }
  },
  methods: {
    async getData (mid) {
      const infoData = await get('/weapp/tabsucai', {id: mid})
      this.info = infoData
    }
  },
  mounted () {
    this.getData(this.id)
  }
}
</script>
<style>

</style>
